$w: 10rem;
$c: blue;

// 头部
header{
    width: $w;
    height: 1.3333rem;
    display: flex;
    background: $c;
    justify-content: space-between;

    .logo{
        width: 7.3rem;

        img{
            width: 3.3101rem;
            margin: .3333rem;
        }
    }

    .appDown{
        width: 1.28rem;
        img{
            width: .9067rem;
            margin: 0.2rem;
        }

    }
}

// 搜索
#search{
    width: $w;
    height: 1.36rem;
    display: flex;
    div.searchIpt input{
        width: 8.52rem;
        height: .8rem;
        margin: .2rem;
        background: #cecece;
        border-radius: 0.5rem;
        border: none;
        font-size: .5rem;
        padding-left: .5333rem;
        outline: none;
    }
    div.searchBtn button{
        background: blue;
        width: 1.68rem;
        height: .8rem;
        color: #fff;
        border-radius: 0.5rem;
        margin: .2rem 0 .2rem -1.3rem;
        border: none;
        font-size: .56rem;
    }
}

// 主体
main{
    border-top: .0533rem solid #cecece;
    width: $w;
    // height: 11.7267rem;
    .menuBar{
        .title{
            display: flex;
            justify-content: space-between;
        border: .0533rem solid #cecece;


            h4{
                margin-left: .5rem;
                font: .4267rem/1.0024rem "微软雅黑";
                font-weight: normal;
                
            }
            p{
                width: 0;
                height: 0;
                margin-top: .4rem;
                margin-right: .5rem;
                font: .4267rem/1.0024rem "";
                border: {
                    left: .256rem solid transparent;
                    right: .256rem solid transparent;
                    top: .256rem solid #000;
                    bottom: .256rem solid transparent;
                }
        }
        
        
        .content{
            margin-right: .5rem;
            }
        }
       
        .content{
            overflow: hidden;
            // display: none;
            p {
                float: left;
                width: 2.46rem;
                height: 1.04rem;
                line-height: 1.04rem;
                text-align: center;
                box-sizing: border-box;
                border: 1px solid #ccc;
            }
        }
    }
}

// 尾部
.footer{
    width: $w;
    background: #f4f4f4;
    height: 5.9768rem;
    div{
        width: $w;
        background: #f4f4f4;
        &:nth-of-type(1){
            // padding: .2667rem;
            text-align: center;
            padding-top: .3rem;
            a{  
                display: block;
                color: #333;
                font: .3467rem/.8533rem "微软雅黑";
                border: .0267rem solid #cecece;
                border-radius: .2rem;
               
                margin: 0 .1rem;
            }
        }
        &:nth-of-type(2){
            background: $c;
            margin: .2667rem 0 .16rem 0;
            height: .9333rem;
            display: flex;
            justify-content: space-between;
            span{
                color: #fff;
                font: .48rem/.9333rem"";
                margin-left: .2rem;
            }
            a{
                padding: 0 .2667rem 0 0;
                img{
                    width: .5333rem;
                    float: right;
                    margin: .2rem 0;
                }
            }
        }
        &:nth-of-type(3){
            // width: $w;
            border: .0267rem solid #cecece;
            border-left: none;
            border-right: none;
            // display: flex;
            // padding: 0 .4rem;
            margin-top: .5rem;

            a{
                text-align: center;
                display: block;
                color: #333;
                height: .88rem;
                display: inline-block;
                border-right: .0267rem solid #cecece;
                font: .3733rem/.88rem "";
                &:nth-of-type(1){
                    width: 1.6733rem;
                    padding: 0 .5333rem;
                }
                &:nth-of-type(2){
                    width: 2.9333rem;
                }
                &:nth-of-type(3){
                    width: 3.34rem;
                    border-right: none;
                }
            }
        }
    }
    .footTxt{
        text-align: center;
        margin: .2rem 0 .4rem 0;
        p{
            margin: .1rem 0;
            a{
                font-size: .3467rem;
                color: #333;
               
            }
        }
    }
}